
/*
// 动画名称
 // 动画在奇数次（1、3、5...）正向播放，在偶数次（2、4、6...）反向播放。
 // 动画执行方式，linear：匀速；ease：先慢再快后慢；ease-in：由慢速开始；ease-out：由慢速结束；ease-in-out：由慢速开始和结束；
 // 动画延迟时间
 //  动画播放次数，infinite：一直播放
 // 动画完成时间
*/

.down-up-down-anima {
  animation-name: down-up-down; 
  animation-direction: alternate;
  animation-timing-function: linear;
  animation-delay: 0.0s; 
  animation-iteration-count: infinite; 
  animation-duration: 30s; 
}

@keyframes down-up-down {
  0% {
    transform: translateY(0vh);
  }

  25% {
    transform: translateY(10vh);;
  }

  50% {
    transform: translateY(0vh);
  }

  75% {
    transform: translateY(-10vh);
  }

  100% {
    transform: translateY(0vh);
  }
}


.up-down-up-anima {
  animation-name: up-down-up; 
  animation-direction: alternate;
  animation-timing-function: linear;
  animation-delay: 0.0s; 
  animation-iteration-count: infinite; 
  animation-duration: 30s; 
}

@keyframes up-down-up {
  0% {
    transform: translateY(0vh);
  }

  25% {
    transform: translateY(-10vh);;
  }

  50% {
    transform: translateY(0vh);
  }

  75% {
    transform: translateY(10vh);
  }

  100% {
    transform: translateY(0vh);
  }
}

.big-small-big-anima {
  animation-name: big-small-big; 
  animation-direction: alternate; 
  animation-timing-function: linear; 
  animation-iteration-count: infinite; 
  animation-duration: 0.8s; 
}

@keyframes big-small-big {
  0% {
    transform: scale(1);
  }

  25% {
    transform: scale(0.9);
  }

  50% {
    transform: scale(0.7);
  }

  75% {
    transform: scale(0.9);
  }

  100% {
    transform: scale(1);
  }
}


.small-big-small-anima {
  animation-name: small-big-small;
  animation-direction: alternate; 
  animation-timing-function: linear;
  animation-delay: 0s; 
  animation-iteration-count: infinite; 
  animation-duration: 0.8s; 
}

@keyframes small-big-small {
  0% {
    transform: scale(0.7);
  }

  25% {
    transform: scale(0.9);
  }

  50% {
    transform: scale(1);
  }

  75% {
    transform: scale(0.9);
  }

  100% {
    transform: scale(0.7);
  }
}

.photo-wall-play-anim-center{
  animation-name: big-small-big; 
  animation-direction: alternate; 
  animation-timing-function: linear; 
  animation-iteration-count: infinite; 
  animation-duration: 0.8s; 
}

.photo-wall-play-anim{
  animation-name: small-big-small; 
  animation-direction: alternate; 
  animation-timing-function: linear; 
  animation-iteration-count: infinite; 
  animation-duration: 0.8s; 
}